<template>
  <DetailCard>
    <template #title> 购车须知 </template>
    <template #content>
      <div class="car-buy-notice">
        <ul>
          <li
            ><span class="notice-title">车辆归属</span
            ><span>绿色出行出租人对出租车辆具有所有权或已取得所有权人授权出租使用。</span></li
          >
          <li><span class="notice-title">租车资料</span><span>承租人需提供本人有效身份证、驾驶证等相关资料。</span></li>
          <li
            ><span class="notice-title">违章处理</span
            ><span
              >承租人应及时、主动地查询并处理车辆违法违章情况；或承租人在接到出租人告知其有未处理的交通违法行为通知后及时进行处理。</span
            ></li
          >
          <li
            ><span class="notice-title">车辆保证金</span
            ><span
              >保证金保证范围包括：租金、利息、违约金、损害赔偿金、交通违法罚款、交通事故赔偿金、实现债权的费用及合同约定应当由承租人承担的其他损失和费用等。</span
            ></li
          >
        </ul>
        <div class="h4"> 租赁期满后两种方案可选 </div>
        <div class="row flex ml-8 py-5">
          <div class="bg-gray mr-8 px-4 md:w-1/4">
            <div class="h5 my-3 text-primary">方案一：取得车辆所有权</div>
            <div class="text-xs"> 租赁期满且满足过户条件后7日内，出租人通知并配合承租人办理车辆过户手续。 </div>
          </div>
          <div class="bg-gray px-4 md:w-1/3">
            <div class="h5 my-3 text-primary">方案二：退还车辆</div>
            <div class="text-xs">
              承租人在租赁到期退回车辆不再租赁的，承租人在支付全部租金且对出租人未拖欠任何费用的。退回的车辆经出租人检验合格的，出租人向承租人一次性支付一定金额（不同车型不同金额）作为补偿。
            </div>
          </div>
        </div></div
      >
    </template>
  </DetailCard>
</template>

<script>
  export default {
    name: 'BuyNotice',
    data() {
      return {}
    },
    methods: {},
  }
</script>

<style scoped>
  .car-buy-notice {
    color: #000;
  }
  .car-buy-notice {
    padding: 20px;
  }
  .car-buy-notice li {
    margin-bottom: 20px;
  }
  .car-buy-notice li span.notice-title {
    color: #000;
    font-size: 16px;
    font-weight: 700;
    width: 120px;
    text-align: left;
    display: inline-block;
    margin-right: 20px;
    padding-left: 30px;
  }
  .car-buy-notice li span {
    font-weight: 100;
    font-size: 14px;
    color: #000;
  }
  .car-buy-notice .h4 {
    color: #000;
    padding-left: 30px;
    margin-top: 30px;
    margin-bottom: 10px;
    font-size: 16px;
    line-height: 1.1;
    font-weight: 700;
  }

  .car-buy-notice .row > div {
    margin-right: 30px;
    height: 100px;
  }
  .car-buy-notice .bg-gray {
    background: #f5f5f5;
  }
</style>
